<template>
	<view>
		<view class="register-con flex align-center justify-between">
			<view></view>
			<view @click="toRegister">注册</view>
		</view>
		<view class="contenr flex flex-direction align-center">
			<input placeholder="手机号" v-model="username"/>
			<input password placeholder="密码" v-model="password"/>
			<button class="flex align-center justify-center" @tap="login"><text>立即登录</text></button>
			<view class="zhaohui flex justify-center justify-center">
				<view @click="sms" class="flex align-center">短信安全登录</view>
				<view @click="forgetPassword" class="flex align-center">快速找回密码</view>
			</view>
			<!-- #ifdef MP-WEIXIN -->
			<view class="bottom flex align-center justify-center">
				<text>——</text>
				<image src="/static/a8.png"></image>
				<text @tap="toWxLogin">微信快速登录</text>
				<text>——</text>
			</view>
			<!-- #endif -->
			<!-- #ifdef MP-ALIPAY -->
			<view class="bottom flex align-center justify-center">
				<text>——</text>
				<image src="/static/c3.png"></image>
				<text @tap="toAliLogin">支付宝快速登录</text>
				<text>——</text>
			</view>
			<!-- #endif -->
		</view>
	</view>
</template>

<script>
	var api = require('@/components/api.js');
	export default {
		data() {
			return {
				loading: false,
				username: "",
				password: "",
			}
		},
		onLoad(){
			this.loadUser()
		},
		methods: {
			login() {
				this.loading = true;
				if (this.username == '') {
					uni.showToast({
						icon: 'none',
						title: '请输入手机号'
					});
					this.loading = false;
					return;
				}
				if (this.password == '') {
					uni.showToast({
						icon: 'none',
						title: '请输入密码'
					});
					this.loading = false;
					return;
				}
				api.get({
					url: 'User/GetLogin',
					data: {
						username: this.username,
						password: this.password
					},
					success: data => {
						console.log(data);
						if (data.ErrCode == 0) {
							this.loading = false;
							console.log(data);
							uni.showToast({
								duration: 500,
								icon: 'success',
								title: data.ErrMsg
							});
							uni.setStorageSync('user', data.Response)
							//强制页面重载，跳转到首页
							uni.reLaunch({
								url: '/pages/index/index'
							});
							uni.setStorageSync('upload', 1)
							uni.setStorageSync('login', 1)
							uni.setStorageSync('token', data.Response)
							uni.setStorageSync('user', data.Response)
							setTimeout((e => {
								uni.navigateBack();
							}), 500);
						}
						if (data.code == 1) {
							this.loading = false;
							uni.showToast({
								duration: 1500,
								icon: 'none',
								title: data.ErrMsg
							});
						}
					}
				})
			},
			loadUser:function(){
				try {
				    this.user  = uni.getStorageSync('user');
					 console.log( this.user);
					 if(this.user&&this.user.user_id){
						uni.reLaunch({
							url: '/pages/index/index'
						}); 
					 }
				} catch (e) {
				    // error
				}
				
			},
			forgetPassword(){
				uni.navigateTo({
					url:"/pages/forgetPassword/forgetPassword"
				})
			},
			toWxLogin() {
			
				uni.navigateTo({
					url: '/pages/wxLogin/wxLogin'
				})
			
			},
			toAliLogin() {
			
				uni.navigateTo({
					url: '/pages/aliLogin/aliLogin'
				})
			
			},
			sms(){
				uni.navigateTo({
					url:"/pages/SMSlogin/SMSlogin"
				})
			},
			toRegister(){
				uni.navigateTo({
					url:"/pages/register/register"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.register-con{
		padding: 0 30upx;
		box-sizing: border-box;
		height: 100upx;
	}
	.bottom text:nth-child(1),.bottom text:nth-child(4){
		color: #999999;
	}
	.bottom text:nth-child(3){
		font-size: 26upx;
		color: #000000;
	}
	.bottom image{
		width: 37upx;
		height: 30upx;
		margin-right: 16upx;
	}
	.bottom{
		margin-top: 80upx;
	}
	.zhaohui view{
		padding: 0 30upx;
		height: 26upx;
		margin-top: 50upx;
	}
	.zhaohui view:nth-child(1){
		border-right: 1upx solid #999999;
		font-size: 26upx;
		color: #444444;
		line-height: 36upx;
	}
	.contenr button{
		margin-top: 10upx;
		width: 660upx;
		height: 72upx;
		background-color: $btn-bground;
		border-radius: 35upx;
		padding: 0;
	}
	.contenr button text{
		font-size: 28upx;
		color: #ffffff;
	}
	.contenr input{
		width: 660upx;
		height: 70upx;
		background-color: #f0f0f0;
		border-radius: 35upx;
		padding-left: 42upx;
		margin-bottom: 30upx;
	}
	page{
		background-color: #fff;
	}

</style>
